<template>
  <!-- 新增请假 -->
  <view class="form">
   <uni-forms ref="valiForm" :rules="rules" :modelValue="form">
    	<uni-forms-item label="请假人" required name="userName" label-width='80px' >
    		 <uni-data-select   v-model="form.userName" :localdata="userList" @change="setNickName">
    		 </uni-data-select>
    	</uni-forms-item>
      <uni-forms-item label="请假日期" required name="offdutyDate" label-width='80px'>
        <uni-datetime-picker type="date"  v-model="form.offdutyDate"  />
      </uni-forms-item>
      <uni-forms-item label="请假事由" required name="remark" label-width='80px'>
        <uni-easyinput type="textarea" v-model="form.remark" placeholder="请输入请假事由" />
      </uni-forms-item>
      </uni-forms>
      <u-button type="primary" text="确定"  @click="submit('valiForm')"></u-button>
  </view>
</template>

<script>
  import {
    listDuty,
    getDuty,
    delDuty,
    addDuty,
    updateDuty,
  } from "@/api/system/duty";
  export default {
    data() {
      return {
        form:{},
        queryParams:{
            pageNum: 1,
           pageSize: 100,
        },
        userList:[],
        rules:{
          userName: {
          						rules: [{
          							required: true,
          							errorMessage: '姓名不能为空'
          						}]
          					},
          offdutyDate: {
          						rules: [{
          							required: true,
          							errorMessage: '请假日期不能为空'
          						}]
          					},
          remark: {
                    						rules: [{
                    							required: true,
                    							errorMessage: '请假事由不能为空'
                    						}]
                    					},
        },
        show:false
      }
    },
    onReady(){
      this.getUserList()
      // 设置自定义表单校验规则，必须在节点渲染完毕后执行
      			this.$refs.valiForm.setRules(this.rules)
    },
    methods: {
      async getUserList(){
        const {data:{rows}} =await this.$myRequest({
          url: "/system/user/list",
          data: this.queryParams,
        })
         // console.log(rows)
        this.userList=rows.map((item) => {
							return {
								value: item.userName,
								text: item.nickName
							}
						});
						 this.show=true
      },
      // 选择请假人时，给nickname赋值中文名，并且给审批人赋值
     async setNickName(e){
       const {data:{rows}} =await this.$myRequest({
          url: "/system/user/list",
          data: { userName: e },
        })
        this.form.nickName=rows[0].nickName
        this.form.personIncharge=rows[0].personIncharge
        // console.log(this.form)
      },
      submit(ref) {
        this.form.offdutyStat=0
      				this.$refs[ref].validate().then(async(res) => {
      					// console.log('success', res);
      					// uni.showToast({
      					// 	title: `校验通过`
      					// })
                await addDuty(this.form)
               uni.showToast({
               	title: '提交成功',
               	duration: 2000
               });
               setTimeout(() => {
               	uni.redirectTo({
               		url: '../duty/duty'
               	})
               },200)
                
                
      				}).catch(err => {
      					// console.log('err', err);
      				})
      			},
    }
  }
</script>

<style lang="scss" scoped>
.form{
  // border: 1px red solid;
  width: 700rpx;
  margin: 20px auto;
}
</style>
